<template>
	<div class="item-options-box">
		<div class="options-item">
			<van-checkbox-group
				@change="changeValue"
				v-model="defaultValue"
				direction="horizontal"
				:disabled="disabled"
			>
				<van-checkbox
					v-for="(item, i) in objList"
					:key="i"
					:disabled="item.disabled"
					:name="item.code"
					shape="square"
					>{{ item.name }}</van-checkbox
				>
			</van-checkbox-group>
		</div>
	</div>
</template>

<script>
// 复选框组件 支持回显 多选 限制选择数量
import { mapGetters } from 'vuex'
import { Checkbox, CheckboxGroup } from 'vant';
export default {
	name: 'commonCheckByPG',
	props: {
		// 字典code
		code: {
			require: true,
			default: 'JGLX'
		},
		// 标题
		label: {
			require: true
		},
		// 是否必填
		required: {
			require: false,
			default: false
		},
		// 回显值
		value: {
			require: false
		},
		// 占位文字
		placeholderText: {
			require: false,
			default: '请选择'
		},
		// 输入框位置
		iptAlign: {
			require: false,
			default: 'right'
		},
		disabled: {
			require: false,
			default: false
		},
		disabledItem: {
			require: false
		}
	},
	components: {
		'van-checkbox':Checkbox,
		'van-checkbox-group':CheckboxGroup,
	},
	data() {
		return {
			defaultValue: []
		}
	},
	computed: {
		...mapGetters(['dictList']),
		objList() {
			console.log('--0090-=====', this.disabledItem)
			let target = this.dictList.find((item) => item.code == this.code)
			let arr = []
			if (target && target.children.length > 0) {
				if (this.disabledItem && this.disabledItem.length > 0) {
				}
				for (let i = 0; i < target.children.length; i++) {
					arr.push({
						name: target.children[i].name,
						code: target.children[i].code,
						disabled: this.disabledItem[i] ? true : false
					})
				}
				// 	target.children.forEach((item) => {
				// 	arr.push({ name: item.name, code: item.code,disabled:false })
				// })
			}
			return arr
		}
	},
	created() {
		console.log(this.value)
		if (this.value) {
			this.defaultValue = this.value.split(',')
		}

		// this.defaultValue = this.value
	},
	methods: {
		changeValue(value) {
			let str = ''
			for (let i = 0; i < value.length; i++) {
				str += value[i] + ','
			}
			let str2 = str.substring(0, str.length - 1)
			let arr = []
			if (str2) {
				arr = str2.split(',')
			}
			this.$emit('change', arr)
		}
	}
}
</script>
<style lang="less" scoped>
.van-checkbox {
	margin-bottom: 10px;
}
.item-options-box {
	.options-item {
		.van-checkbox {
			width: 100%;
			padding: 20px 15px;
			margin: 15px 0;
			border: 1px solid #f0f0f0;
			font-size: 24px;
		}
	}
}
</style>
